<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>The source code</title>
  <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
  <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
  <style type="text/css">
    .highlight { display: block; background-color: #ddd; }
  </style>
  <script type="text/javascript">
    function highlight() {
      document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
    }
  </script>
</head>
<body onload="prettyPrint(); highlight();">
  <pre class="prettyprint lang-js"><span id='global-property-'>/**
</span> * @ignore
 * smiley button
 * @author yiminghe@gmail.com
 */
KISSY.add(&quot;editor/plugin/smiley&quot;, function (S, Editor, Overlay4E) {
    var smiley_markup = &quot;&lt;div class='{prefixCls}editor-smiley-sprite'&gt;&quot;;
    for (var i = 0; i &lt;= 98; i++) {
        smiley_markup += &quot;&lt;a href='javascript:void(0)' &quot; +
            &quot;data-icon='http://a.tbcdn.cn/sys/wangwang/smiley/48x48/&quot; + i + &quot;.gif'&gt;&quot; +
            &quot;&lt;/a&gt;&quot;
    }
    smiley_markup += &quot;&lt;/div&gt;&quot;;

    function Smiley() {
    }

    S.augment(Smiley, {
        pluginRenderUI: function (editor) {

            var prefixCls = editor.get('prefixCls');

            editor.addButton(&quot;smiley&quot;, {
                tooltip: &quot;插入表情&quot;,
                checkable: true,
                listeners: {
                    afterSyncUI: function () {
                        var self = this;
                        self.on(&quot;blur&quot;, function () {
                            // make click event fire
                            setTimeout(function () {
                                self.smiley &amp;&amp; self.smiley.hide();
                            }, 150);
                        });

                    },
                    click: function () {
                        var self = this, smiley, checked = self.get(&quot;checked&quot;);
                        if (checked) {
                            if (!(smiley = self.smiley)) {
                                smiley = self.smiley = new Overlay4E({
                                    content: S.substitute(smiley_markup, {
                                        prefixCls: prefixCls
                                    }),
                                    focus4e: false,
                                    width: 300,
                                    elCls: prefixCls + &quot;editor-popup&quot;,
                                    zIndex: Editor.baseZIndex(Editor.ZIndexManager.POPUP_MENU),
                                    mask: false
                                }).render();
                                smiley.get(&quot;el&quot;).on(&quot;click&quot;, function (ev) {
                                    var t = new S.Node(ev.target),
                                        icon;
                                    if (t.nodeName() == &quot;a&quot; &amp;&amp;
                                        (icon = t.attr(&quot;data-icon&quot;))) {
                                        var img = new S.Node(&quot;&lt;img &quot; +
                                            &quot;alt='' src='&quot; +
                                            icon + &quot;'/&gt;&quot;, null,
                                            editor.get(&quot;document&quot;)[0]);
                                        editor.insertElement(img);
                                    }
                                });
                                smiley.on(&quot;hide&quot;, function () {
                                    self.set(&quot;checked&quot;, false);
                                });
                            }
                            smiley.set(&quot;align&quot;, {
                                node: this.get(&quot;el&quot;),
                                points: [&quot;bl&quot;, &quot;tl&quot;],
                                overflow: {
                                    adjustX: 1,
                                    adjustY: 1
                                }
                            });
                            smiley.show();
                        } else {
                            self.smiley &amp;&amp; self.smiley.hide();
                        }
                    },
                    destroy: function () {
                        if (this.smiley) {
                            this.smiley.destroy();
                        }
                    }

                },
                mode: Editor.Mode.WYSIWYG_MODE
            });
        }
    });

    return Smiley;
}, {
    requires: ['editor', './overlay']
});</pre>
</body>
</html>
